<%@ page language="java" pageEncoding="UTF-8" contentType="text/html;charset=utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@include file="/common/taglibs.jsp"%>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@ include file="/common/scripts.jsp"%>
<style>
#sortable {
	list-style-type: none;
	margin: 0;
	padding: 0;
	width: 60%;
}

#sortable li {
	margin: 0 3px 3px 3px;
	padding: 0.4em;
	padding-left: 1.5em;
	height: 80px;
}

#sortable li span {
	position: absolute;
	margin-left: -1.3em;
}
</style>
<script type="text/javascript">

    $(function() {
        $("#sortable").sortable({ update:function(){
            var l = $("#sortable").sortable("toArray");
            $.post("<c:url value='sort'/>",{"sort":l.join(",")}, function(data){},'json');
        }});
    });
</script>
</head>
<body>
  <div class="pageOuter">
    <div class="contentOuter">
      <div class="pageTitle">
        <fmt:message key='menu.manage.appAd' />
      </div>
      <div class="buttonBox_R">
        <a href="<c:url value='add'/>" class="css_btn" style="float: right;"><img class="button add" src="<c:url value='/images/icon_transparent.png'/>" />
          <fmt:message key='button.add' /></a>
      </div>      
            <table class="grid_list">
                <tr>
                  <th style="width:25%"><fmt:message key='bo.AppAdItem.slogn'/></th>
                  <th style="width:40%"><fmt:message key='bo.AppAdItem.adDesc'/></th>
                  <th style="width:15%"><fmt:message key='bo.AppAdItem.appItem'/></th>                  
                  <th style="width:10%"><fmt:message key='bo.AppAdItem.adType'/></th>
                  <th style="width:10%"><fmt:message key='bo.AppAdItem.enable'/></th>
                </tr>
                <tbody>
                <c:forEach var="a" items="${appAdItemList }">
                <tr>
                  <td><a href="<c:url value='edit?id=${a.id}'/>">${a.slogn }</a></td>
                  <td>${a.adDesc }</td>
                  <td>${a.appItem.appName }</td>
                  <td><c:choose>
                    <c:when test="${a.adType == 'AD' }"><fmt:message key='bo.AppAdItem.adType.ad'/></c:when>
                    <c:when test="${a.adType == 'HOT' }"><fmt:message key='bo.AppAdItem.adType.hot'/></c:when>
                  </c:choose></td>                  
                  <td><c:choose>
                    <c:when test="${a.enable }"><fmt:message key='bo.AppAdItem.enable.true'/></c:when>
                    <c:when test="${!a.enable }"><fmt:message key='bo.AppAdItem.enable.false'/></c:when>
                  </c:choose></td>
                </tr>
                </c:forEach>
                </tbody>
                <tbody>
                </tbody>
              </table>
<%--       <div class="buttonBox_R">
        <a href="<c:url value='add'/>" class="css_btn" style="float: right;"><img class="button add" src="<c:url value='/images/icon_transparent.png'/>" />
          <fmt:message key='button.add' /></a>
      </div>
      <div class="blockBorder">
        <ul id="sortable">
          <c:forEach var="a" items="${appAdItemList }">
            <li id="${a.id }" class="ui-state-default"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span> <a href="<c:url value='edit?id=${a.id}'/>">${a.slogn }</a>
              <ul>
                <li>${a.appItem.appName }</li>
              </ul></li>
          </c:forEach>
        </ul>
      </div> --%>
    </div>
  </div>
</body>
</html>
